<template>
  <el-dialog width="50%" append-to-body :title="type == 'add'?'新增·发布':'编辑·发布'"
             :close-on-click-modal="clickModalHide"
             :before-close="closeDialog"
             :visible.sync="centerDialogVisible"
        >
    <div class="csstop">
        <div class="cssborder"></div>
        <div class="cssborder2"></div>
        <div class="cssborder3"></div>
    </div>
    <el-divider></el-divider>
    <div>
      <el-form ref="dataForm"
               :model="messageData"
               label-position="left"
               size="mini"
               label-width="0px">

        <el-row>
          <el-col :span="12">
            <div class="el-dialog-item">
              <el-date-picker v-model="createTime" disabled placeholder="日期"
                              size="mini"
                              type="date"></el-date-picker>
            </div>
          </el-col>
          <el-col :span="12">
            <div class="el-dialog-item el-form-right">
              <el-input clearable  v-model="userName"  disabled placeholder="发布人"
                        size="mini"/>
            </div>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="24">
            <div class="el-dialog-item" style="display:flex">
              <el-input clearable  v-model="messageData.title" placeholder="主题"
                        size="mini" />
            </div>
          </el-col>
        </el-row>
        <quill-editor ref="text" v-model="messageData.content" class="myQuillEditor"  />
      </el-form>
      <div slot="footer"
           class="dialog-footer"
           style="margin-top:40px">
        <el-button type="primary" @click="updateNotice('0')"
                   size="mini" class="zll_dialog_bt"
                   :class="messageData.publishStatus =='1'?'disabled_btn':''"
          >
          暂 存
        </el-button>
        <el-button type="green"
                   size="mini" class="zll_dialog_bt"
                   :class="messageData.publishStatus =='1'?'disabled_btn':''"
                   style="margin-left:30%"  @click="updateNotice('1')">
          发 布
        </el-button>
      </div>
    </div>
  </el-dialog>
</template>
<script>
  import { getToken } from '@/utils/auth' // 验权
  import { quillEditor } from 'vue-quill-editor'
  import 'quill/dist/quill.core.css'
  import 'quill/dist/quill.snow.css'
  import 'quill/dist/quill.bubble.css'
  export default {
    name:"noticeEdit",
    props:["detailData","type"],
    components:{quillEditor},
    data(){
      return{
        messageData:{publishId:"",title:"",content:""},
        centerDialogVisible: false,
        clickModalHide: false,
        count:0,
        userName:"",
        createTime:new Date()
      }
    },

    methods:{

      closeDialog() {
        this.centerDialogVisible = false;
      },

        updateNotice(publishStatus){
          let self = this;
          let url = this.type == 'add' ? "/drug/notice/addNotice" : "/drug/notice/updateNotice";
          self.messageData.publishStatus = publishStatus;
          if (this.count == 0) {
            self.$http({
              url: url,
              method: "post",
              data: JSON.stringify(self.messageData),
              dataType: 'json',
              contentType: "application/json",
            }).then(resp => {
              if (resp.success) {
                self.$eventBus.$emit("updateNTList");
                self.$notify({
                  title: '提示',
                  message: "操作成功！",
                  type: 'success'
                });
                self.centerDialogVisible = false;
                return
              }
              self.$notify({
                title: '提示',
                message: "出现异常，请联系管理员",
                type: 'error'
              });
              this.count--;
            });
            this.count++;
          }
        }
    },
    watch:{
      detailData(val){
        let user = JSON.parse(getToken());
        this.count = 0;
        this.messageData = val;
        this.centerDialogVisible = true;
        delete this.messageData.createTime;
        this.messageData.publishId = user.id;
        this.userName = user.userName;
      }
    }
  }
</script>

<style scoped lang="scss">
  .el-button.disabled_btn {
    pointer-events: none;
    cursor: not-allowed !important;
    background-color: #7e8c8d !important;
    border:  #7e8c8d !important;
  }
  .el-dialog .el-button--primary {
    background-color: #d09c4f;
    border-color: #d09c4f;
    &:hover {
    background-color: #d09c4f;
    border-color: #d09c4f;
    	opacity: .8;
    }
  }
</style>

